import React, { Component, Fragment } from "react";
import PropTypes from "prop-types";
import { adminToken } from "@/utils/variable";
import { Upload } from "antd";
import { PlusOutlined } from "@ant-design/icons";
export default class CustomUpload extends Component {
    constructor() {
        super();
        this.state = {
            imageUrl: "",
        };
    }
    static propTypes = {
        onFinish: PropTypes.func,
    };
    static defaultProps = {
        onFinish: () => {},
    };
    UNSAFE_componentWillReceiveProps(props) {
        this.setState({ imageUrl: props.imageUrl })
    }
    render() {
        const { imageUrl } = this.state;
        return (
            <Fragment>
                <Upload
                    fileList={[]}
                    action={process.env.REACT_APP_FILE}
                    headers={{ Authorization: `Bearer ${localStorage[adminToken]}` }}
                    listType="picture-card"
                    onChange={info => {
                        if (info.file.status == "done") {
                            this.setState({ imageUrl: info.file.response.originalname }, () => {
                                this.props.onFinish(this.state.imageUrl);
                            });
                        }
                    }}
                >
                    {imageUrl ? <img width="100%" src={`${process.env.REACT_APP_FILE}/${imageUrl}`} /> : <PlusOutlined />}
                </Upload>
            </Fragment>
        );
    }
}
